<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <!-- 设置标准理想视口 -->
  <meta name='viewport' content='width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no'>
  <title>京东</title>
  <!-- 添加icon图标 -->
  <link rel="shortcut icon" href="./favicon.ico">

  <!-- 引入css -->
  <link rel="stylesheet" href="./css/normalize.css">
  <link rel="stylesheet" href="./css/base.css">
  <link rel="stylesheet" href="./css/index.css">
</head>
<body>
  <div class="view">
    <!-- 顶部的搜索框 -->
    <div class="search">
      <a href="#" class="logo"><i></i></a>
      <div class="search_box">
        <input type="text" placeholder="100万件超级爆品疯抢">
      </div>
      <a href="#" class="login">登陆</a>
    </div>

    <!-- 轮播图部分 -->
    <div class="slider">
      <ul>
        <li>
          <a href="#"><img src="./uploads/l1.jpg" alt=""></a>
        </li>
      </ul>
    </div>

    <!-- 导航部分 -->
    <div class="jd_nav">
      <!-- (a[href=#]>img[src='./images/nav_$.png']+p{京东超市})*8 -->
      <a href="#">
        <img src="./images/nav_1.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_2.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_3.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_4.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_5.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_6.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_7.png" alt="">
        <p>京东超市</p>
      </a>
      <a href="#">
        <img src="./images/nav_8.png" alt="">
        <p>京东超市</p>
      </a>
    </div>

    <!-- 掌上秒杀部分 -->
    <div class="seckill">
      <!-- 秒杀标题 -->
      <div class="seckill_title">
        <div class="title_content">
          <i class="clook"></i>
          <h3>掌上秒杀</h3>
          <div class="time">
            <span>0</span>
            <span>5</span>
            <span>:</span>
            <span>1</span>
            <span>4</span>
            <span>:</span>
            <span>4</span>
            <span>3</span>
          </div>
        </div>
        <a href="#">更多秒杀 &gt;</a>
      </div>
      <!-- 秒杀内容 -->
      <div class="seckill_content">
        <!-- ul>li*3>a[href='#']>img[src='./uploads/seckill_$.jpg']+p{￥79}+p{￥139} -->
        <ul>
          <li>
            <a href="#">
              <img src="./uploads/seckill_1.jpg" alt="">
              <p>￥79</p>
              <p><del>￥139</del></p>
              <span>热卖</span>
            </a>
          </li>
          <li>
            <a href="#">
              <img src="./uploads/seckill_2.jpg" alt="">
              <p>￥79</p>
              <p><del>￥139</del></p>
              <span>热卖</span>
            </a>
          </li>
          <li>
            <a href="#">
              <img src="./uploads/seckill_3.jpg" alt="">
              <p>￥79</p>
              <p><del>￥139</del></p>
              <span>热卖</span>
            </a>
          </li>
        </ul>
      </div>
    </div>


  </div>

  <pre>
                        _ooOoo_
                          o8888888o
                          88" . "88
                          (| -_- |)
                          O\  =  /O
                       ____/`---'\____
                     .'  \\|     |//  `.
                    /  \\|||  :  |||//  \
                   /  _||||| -:- |||||-  \
                   |   | \\\  -  /// |   |
                   | \_|  ''\---/''  |   |
                   \  .-\__  `-`  ___/-. /
                 ___`. .'  /--.--\  `. . __
              ."" '<  `.___\_<|>_/___.'  >'"".
             | | :  `- \`.;`\ _ /`;.`/ - ` : | |
             \  \ `-.   \_ __\ /__ _/   .-` /  /
        ======`-.____`-.___\_____/___.-`____.-'======
                           `=---='
        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
                 佛祖保佑       永无BUG

  </pre>
</body>
</html>